<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<html>
<head>
    <title>登陆页面</title>
    <link rel="stylesheet" href="./css/a.css">
    <style>
        .box1{
            background-image: url("./image/book.png");
            background-repeat: no-repeat;
            background-size: cover;
        }
        .box2{
            width: 1500px;
            height: 600px;
        }
        .box3{
            font-size: 40px;

            align-items: center;

        }
        /*.box4{*/
        /*    width: 90px;*/
        /*    height: 50px;*/
        /*    display: flex;*/
        /*    justify-content: center;*/
        /*    align-items: center;*/

        /*}*/
    </style>
</head>
<body class="box1">
<p style="background-color: red">${msg}</p>
<p style="background-color: red">${codeMsg}</p>
<div class="center">
<form action="/user" method="post" class="for">
    <div class="box4">
    <table border="1px"  cellspacing="0px" cellpadding="10px" class="box2" bgcolor="#f0f8ff" >
<%--        <tr style="">--%>
<%--            ${USER_SESSION.headImg}--%>
<%--        </tr>--%>
        <tr style="width: 69px; height: 69px" class="box3">
            <td class="box3">用户名</td>
            <td><input type="text" name="username" class="box3" value="${cookie.username.value}"></td>
        </tr>
        <tr style="width: 69px; height: 69px" class="box3">
            <td class="box3">密码</td>
            <td><input type="password" name="password" class="box3"></td>
        </tr>

        <tr style="width: 69px; height: 69px" class="box3">
           <td>
               <div><input type="text" placeholder="请输入验证码" name="randomCode"></div>
            <td>
<%--            todo 路径问题--%>
                   <img src="/randomCode" alt="验证码" onclick="changeImg()" id="randomCode">
                   <script>
                       function changeImg(){
                          var elementById = document.getElementById("randomCode");
                          alert(elementById.src)
                          elementById.src='/randomCode?'+Math.random();
                       }
                   </script>
               </td>

           </td>
        </tr>

<%--todo 在游览器中记住我 ，cookie的使用 ，第一次不用记忆--%>
        <tr>
        <td colspan="2">
            <input type="checkbox" name="rememberMe" value="true"
            ${cookie.username.value !=null ?'checked':''}>记住我
        </td>
        </tr>

        <tr style="width: 69px; height: 69px" class="box3">
            <td align="center" colspan="2">
                <input type="submit" value="登陆" class="box3">
                <button class="box3">
                    <a href="/register.jsp">注册</a>
                </button>
            </td>
        </tr>
    </table>
    </div>
</form>
</div>
</body>
</html>
